<template>
  <div style="font-size: 14px">
    <div class="container-x-suit">
      <div class="container-x-p short">
        <h2>关于虎匠</h2>
        <p>虎匠是中国第一家专注于建筑“农民工”领域的大型平台。核心业务是铝合金模板安装与市政工程项目的施工与管理。平台注册铝合金模板工人40000多人，班组3000多个，星级班组1000多个；市政工人15万多人，班组10000多个，星级班组2000多个；装修工人12万多人，班组6000多个，星级班组1600。目前在建项目200多个；</p>
      </div>
    </div>
    <div class="row-bg">
      <div class="container-x-suit">
        <div class="container-x-p flex">
          <div class="item text">
            <h3 class="h">平台特色一：统一培训 星级管理</h3>
            <div class="t">
              <p>虎匠致力于推动建筑工人产业化，职业化。虎匠建立了建筑工人统一培训系统，涵盖了市政、房建、装修三大领域，四十多个工种。平台对所有班组进行统一认证，从一星到五星，其中四星级以上班组必须进行全员系统培训，持证上岗，成为建筑施工企业的标杆。</p>
            </div>
          </div>
          <div class="item img">
             <img :src="requireImg('qyjs1.png')" height="100%" width="100%" />
          </div>
        </div>
      </div>
    </div>
    <div class="row-bg">
      <div class="container-x-suit">
        <div class="container-x-p flex">
          <div class="item img">
            <img :src="requireImg('qyjs2.png')" height="100%" width="100%" />
          </div>
          <div class="item text">
            <h3 class="h">平台特色二：建立工人档案大数据</h3>
            <div class="t">
              <p>所有加入虎匠的班组，全部实名制建立数据库，包括省份信息、培训情况、过往工程、星级评价、获得荣誉等。对于违规操作、恶意讨薪、不服管理等建立黑名单系统。</p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row-bg">
      <div class="container-x-suit">
        <div class="container-x-p flex">
          <div class="item text">
            <h3 class="h">平台特色三：高素质的团队管理</h3>
            <div class="t">
              <p>所有现场班组长、代班，都具备大专以上学历，三年以上现场施工管理经验，经过虎匠系统培训，提供标准化的工程施工过程管理。</p>
            </div>
          </div>
          <div class="item img-3">
            <img :src="requireImg('qyjs3.png')" height="100%" width="100%" />
          </div>
        </div>
      </div>
    </div>
    <div class="row-bg">
      <div class="container-x-suit">
        <div class="container-x-p flex">
          <div class="item img">
            <img :src="requireImg('qyjs4.png')" height="100%" width="100%" />
          </div>
          <div class="item text">
            <h3 class="h">平台特色四：管理信息化</h3>
            <div class="t">
              <p>虎匠科技自主研发的信息管理系统，可以对工人进行全流程远程管理，公司考勤系统及薪资支付系统，可以与国家推行的实名制与分账管理平台无缝对接。</p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="graphic">
      <img :src="requireImg('graphic.png')"/>
    </div>
    <!-- <div class="background-bottom">
      <img :src="requireImg('company-bottom.png')" />
    </div> -->
  </div>
</template>

<script>
import Breviary from '@/base/breviary/breviary'
import txt from './company-intro'
import Evolve from '@/base/evolve/evolve'
import { requireImgMixin } from '@/common/js/mixin'

export default {
  name: 'InCompanyIntro',
  mixins: [requireImgMixin],
  data() {
    return {
      txt: {...txt}
    }
  },
  created() {
  },
  methods: {
  },
  components: {
    Breviary,
    Evolve
  }
}
</script>

<style lang="stylus" scoped>
@import '~common/stylus/variable.styl'

.row-bg
  background-color: $color-theme
  margin-bottom: 50px
  color: #FFF
  &:nth-child(odd)
    background: #f4f4f4
    color: #000
.graphic
  padding: 20px 0 50px 0
  text-align: center

.container-x-suit
  .container-x-p
    padding: 0 20px
    &.short
      font-size: 16px
      text-indent: @font-size * 2
      padding: 60px 20px 100px 20px
      font-size: 18px
      h2
        text-align: center
        font-size: 30px
        padding: 20px 0
      p
        padding: 0 80px
        line-height: 32px
  .flex
    display: flex
    .item
      flex: 1
      &.text
        text-align: center
        padding: 50px 0 60px 0
        .h
          font-size: 20px
          padding: 20px 0
        .t
          max-width: 420px
          display: inline-block
          font-size: 14px
          text-align: center
          p
            font-size: 16px
            text-align: left
            line-height: 26px
.background-bottom
  height: 370px
  img
    height: 100%
    position: relative
    left: 50%
    transform: translateX(-50%)

@media (max-width: $media-smail)
  .flex
    flex-direction: column !important
  .short
    p
      padding: 0 !important
  .graphic
    img
      width: 90%
</style>
